$(function () {
  /**
   * 渲染页面
   */
   getArtiList(getUserList)

  /**
   * 添加类别
   */
  let indexAdd = 0
  $('#btn-add').on('click', function () {
    indexAdd = layer.open({
      type: 1,
      title: '添加类别',
      area: ['500px', '260px']
      , content: `
            <form class="layui-form" action="">
              <div class="layui-form-item">
                <label class="layui-form-label">分类名称</label>
                <div class="layui-input-block">
                  <input type="text" name="name" required  lay-verify="required" placeholder="请输入分类名称" autocomplete="off" class="layui-input">
                </div>
              </div>
              <div class="layui-form-item">
                <label class="layui-form-label">分类别名</label>
                <div class="layui-input-block">
                  <input type="text" name="alias" required  lay-verify="required" placeholder="请输入分类别名" autocomplete="off" class="layui-input">
                </div>
              </div>
              <div class="layui-form-item">
                <div class="layui-input-block">
                  <button id="btn-okAdd" class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button>
                </div>
              </div>
            </form>
      `,
    })
  })

  /**
   * 确认提价添加
   */
  $('body').on('click', '#btn-okAdd', function (e) {
    e.preventDefault()
    axios({
      url: '/my/article/addcates',
      method: 'POST',
      data: $('form').serialize()
    }).then(({ data: res }) => {
      //成功回调
      if (res.status != 0) {
        return layui.layer.msg(res.message)
      }
      layui.layer.msg('恭喜您，添加文章成功！')
      getArtiList(getUserList)
      layui.layer.close(indexAdd)
    }).catch(() => {
      layui.layer.msg('页面错误，请联系管理员')
    })
  })

  /**
   * 编辑
   */
  let indexEdit = 0
  $('tbody').on('click', '.editor', function () {
    indexEdit = layer.open({
      type: 1,
      title: '编辑类别',
      area: ['500px', '260px']
      , content: `
            <form id="formEdit" lay-filter="formm" class="layui-form" action="">
              <input type="hidden" name="Id" id="">
              <div class="layui-form-item">
                <label class="layui-form-label">分类名称</label>
                <div class="layui-input-block">
                  <input type="text" name="name" required  lay-verify="required" placeholder="请输入分类名称" autocomplete="off" class="layui-input">
                </div>
              </div>
              <div class="layui-form-item">
                <label class="layui-form-label">分类别名</label>
                <div class="layui-input-block">
                  <input type="text" name="alias" required  lay-verify="required" placeholder="请输入分类别名" autocomplete="off" class="layui-input">
                </div>
              </div>
              <div class="layui-form-item">
                <div class="layui-input-block">
                  <button id="btn-edit" class="layui-btn" lay-submit lay-filter="formDemo">立即修改</button>
                </div>
              </div>
            </form>
      `,
    })
    /**
     * 获取单个信息
     */
    axios({
      url: '/my/article/cates/' + $(this).attr('btn-id')
    }).then(({ data: res }) => {
      //成功回调
      if (res.status != 0) {
        return layui.layer.msg(res.message)
      }
      layui.form.val('formm', res.data)
    }).catch(() => {
      layui.layer.msg('页面错误，请联系管理员')
    })
  })

  /**
   * 确认修改
   */
  $('body').on('click', '#btn-edit', function (e) {
    e.preventDefault()
    axios({
      url: '/my/article/updatecate',
      method: 'POST',
      data: $('#formEdit').serialize()
    }).then(({ data: res }) => {
      //成功回调
      if (res.status != 0) {
        return layui.layer.msg(res.message)
      }
      layui.layer.msg('恭喜您，修改文章成功！')
      getArtiList(getUserList)
      layui.layer.close(indexEdit)
    }).catch(() => {
      layui.layer.msg('页面错误，请联系管理员')
    })
  })

  /**
   * 删除
   */
  $('tbody').on('click', '.del', function () {
    layer.confirm('确认删除吗?', { icon: 3, title: '提示' }, (index) => {
      axios({
        url: '/my/article/deletecate/' + $(this).attr('btn-id')
      }).then(({ data: res }) => {
        //成功回调
        if (res.status != 0) {
          return layui.layer.msg(res.message)
        }
        layui.layer.msg('恭喜您，删除文章成功！')
        getArtiList(getUserList)
      }).catch(() => {
        layui.layer.msg('页面错误，请联系管理员')
      })
    })
    layer.close(index);
  });

})





/**
 * 获取用户信息列表
 */
function getUserList(res) {
  let arr = []
  res.data.forEach(ele => {
    if (ele.Id < 0) return
    arr.push(`
        <tr>
          <td>${ele.Id}</td>
          <td>${ele.name}</td>
          <td>${ele.alias}</td>
          <td>
            <button btn-id="${ele.Id}" class="editor layui-btn layui-btn-xs">编辑</button>
            <button btn-id="${ele.Id}" class="del layui-btn layui-btn-xs layui-btn-danger">删除</button>
          </td>
        </tr>
    `)
  })
  $('tbody').empty().html(arr.join(''))
}